//1.0导入相关包
import Vue from 'vue'
import vueRouter from 'vue-router'
import vueResource from 'vue-resource'

//1.0.1导入相关组件
import App from './App.vue';
import Home from './components/Home/Home.vue';
import Member from './components/Member/Member.vue';
import ShopCar from './components/ShopCar/ShopCar.vue';
import Search from './components/Search/Search.vue';
import newsList from './components/news/newsList.vue';
import newInfo from './components/news/newInfo.vue';
import photoList from './components/Photo/photoList.vue';
import photoInfo from './components/Photo/info.vue';
import goodsList from './components/Goods/goodsList.vue';
import goodsInfo from './components/Goods/goodsInfo.vue';
import goodsComment from './components/Goods/comment.vue';
import goodsDesc from './components/Goods/goodsDesc.vue';

//在这里导入mint-ui  可以单独导入(import {Button} from 'mint-ui')也可全局导入，现在是全局导入
import mintUI from 'mint-ui'

//导入mint-ui的css
import 'mint-ui/lib/style.min.css'

//导入mui相关的css（js这里没有使用就不导入了）
import '../statics/mui/css/mui.css'
import '../statics/mui/css/icons-extra.css'

//导入自己定义的全局样式，可以用来覆盖mint-ui和mui中的样式
import '../statics/css/site.css'

//2.0在vue中加载vueRouter vueResource
Vue.use(vueRouter);
Vue.use(vueResource); //使用vueResource 对象才能自动在Vue实例上挂载一个$http
Vue.use(mintUI); //在这里使用mintUI（注册方式一）

//加载图片预览组件
import VuePreview from 'vue-preview'
Vue.use(VuePreview);

//2.0.1在vue上注册一个全局过滤器名叫fmtdate   （全局过滤器定义）
import moment from 'moment';
Vue.filter('fmtdate',function(input,datefmtstring){ //后面的p是参数，可写可不写
	//由于传入的datefmtstring的格式种类很多，我们自己实现起来比较复杂。
	//所以使用moment.js日期格式插件
	return moment(input).format(datefmtstring);
});

//3.0定义路由规则对象
let router = new vueRouter({
	linkActiveClass:'mui-active',
	routes:[
		{name:'root',path:'/',redirect:'/Home'},                       //表示浏览器如果访问的是http://localhost:3008/#/或者是http://localhost:3008则直接跳转到Home
		{name:'Home',path:'/Home',component:Home},
        {name:'Member',path:'/Member',component:Member},
        {name:'ShopCar',path:'/ShopCar',component:ShopCar},
        {name:'Search',path:'/Search',component:Search},
        {name:'newsList',path:'/news/newsList',component:newsList} ,        //图文列表的路由规则
		{name:'newInfo',path:'/news/newInfo/:id',component:newInfo},             //详情页
		{name:'photoList',path:'/photo/photoList',component:photoList},        //图片分享列表组件
        {name:'photoInfo',path:'/photo/photoInfo/:id',component:photoInfo},       //图片详情
        {name:'goodsList',path:'/goods/goodsList',component:goodsList},
        {name:'goodsInfo',path:'/goods/goodsInfo/:id',component:goodsInfo},
        {name:'goodsComment',path:'/goods/goodsComment/:id',component:goodsComment},    //商品评论
        {name:'goodsDesc',path:'/goods/goodsDesc/:id',component:goodsDesc}     //商品的图文组件
    ]
});

//4.0使用router
new Vue({
	el:'#app',  //在index.html中有一个id为app的div
	router,
	render:c=>c(App)
});